<template>
    <div>
        <div class="mb-2">
            <span>开奖号码：</span>
            <el-input v-model="drawResult" size="small" clearable placeholder="开奖号码">
                <template #append>
                    <el-select v-model="activeIssue" size="small" placeholder="最近 10 期" style="width: 90px"
                        @change="onChangeIssue">
                        <el-option :label="item.lotteryDrawNum" :value="index" v-for="(item, index) of dataset"
                            :key="index" />
                    </el-select>
                </template>
            </el-input>
        </div>
        <div v-show="!importPanelInfo.visible">
            <table class="table-bordered table-striped w-full">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>号码</th>
                        <th>和值</th>
                        <th>结果</th>
                        <th>中奖</th>
                    </tr>
                </thead>
                <tbody>
                    <tr v-for="(item, index) in data" :key="index">
                        <td>{{ index + 1 }}</td>
                        <td v-html="item.text"></td>
                        <td>{{ item.sum }}</td>
                        <td>
                            <strong class="text-red-400" v-if="item.money > 0">{{ item.frontCount + ' + ' +
                                item.backCount
                            }}</strong>
                            <span v-else>-</span>
                        </td>
                        <td :class="item.money > 0 ? 'text-red-400' : ''">
                            {{ item.statusText }}
                            <strong v-if="item.money > 0">
                                （{{ item.moneyText }}元）
                            </strong>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
        <div class="my-2" v-show="importPanelInfo.visible">
            <div>批量导入号码：</div>
            <el-input type="textarea" size="small" v-model="importPanelInfo.content" placeholder="请输入号码，每注号码一行"
                :rows="10"></el-input>
        </div>

        <el-button-group size="small" class="mt-2" v-show="!importPanelInfo.visible">
            <el-button type="primary" @click="importPanelInfo.visible = true">编辑号码</el-button>
            <el-button type="info" @click="onCopy()">复制</el-button>
        </el-button-group>
        <el-button-group size="small" class="mt-2" v-show="importPanelInfo.visible">
            <el-button type="primary" @click="onCalc()">立即计算</el-button>
            <el-button type="warning" @click="importPanelInfo.content = ''">清空</el-button>
        </el-button-group>
    </div>
</template>

<script setup>
import { ref } from 'vue';
import { copyText } from '@/utils/Utils';
import DltOrderModel from '@/model/DltOrderModel';
import DltDataModel from '@/model/DltDataModel';
import { ElMessage } from 'element-plus';
let dltDataModel = new DltDataModel();
let dltOrderModel = new DltOrderModel();
const dataset = dltDataModel.getDataSource().slice(0, 10);
const drawResult = ref('');
const activeIssue = ref('');
const importPanelInfo = ref({
    visible: true,
    content: ''
})
const rowTpl = {
    order: '',
    text: '',
    frontCount: 0,
    backCount: 0,
    totalCount: 0,
    statusText: '',
    status: '',
    moneyText: '',
    money: 0,
    sum: 0,
    diffSum: 0,
};
const data = ref([rowTpl])

const onChangeIssue = (idx) => {
    drawResult.value = dataset[idx].lotteryDrawResult;
}

const onCalc = () => {
    if (drawResult.value.trim().length == 0) {
        ElMessage.error('开奖号码无效');
        return;
    }
    if (importPanelInfo.value.content.trim().length == 0) {
        ElMessage.error('投注号码无效');
        return;
    }

    data.value = [];
    importPanelInfo.value.visible = false;
    let orderList = data.value.filter(v => v.order.length > 0).map(v => v.order);
    importPanelInfo.value.content.trim().split('\n').forEach(v => {
        v = v.replace(/\,|"/g, ' ').trim();
        if (v.length > 0 && !orderList.includes(v)) {
            orderList.push(v);
            data.value.push({ ...rowTpl, order: v, text: v })
        }
    })
    if (data.value[0].order == '') {
        data.value = data.value.slice(1);
    }
    data.value = dltOrderModel.calcOrder(drawResult.value, orderList);
}

const onCopy = () => {
    let arr = []
    data.value.forEach(item => {
        if (item.money > 0) {
            arr.push(`${item.order} ${item.statusText}【${item.moneyText}元】【${item.frontCount}+${item.backCount}】`)
        } else {
            arr.push(`${item.order} ${item.statusText}`)
        }
    })
    copyText(arr.join('\n'));
    ElMessage.success('复制成功')
}
</script>
